{include file="public/header" /}
<body class="gray-bg">
<div class="wrapper wrapper-content">
    <div class="ibox-title">
        <h5>添加分销商</h5>
    </div>
    <div class="ibox-content layui-form">
        <div class="layui-row layui-col-space10 layui-form-item ">
            <div class="layui-form-item layui-col-md-offset1 layui-col-md8">
                <label class="layui-form-label">登录账号（只能数字字母）：</label>
                <div class="layui-input-block">
                    <input type="text" name="fen_username" lay-verify="required|username" placeholder="登录账号" class="layui-input ">
                </div>
            </div>
            <div class="layui-form-item layui-col-md-offset1 layui-col-md8">
                <label class="layui-form-label">头像：</label>
                <div class="layui-input-block">
                    <input type="hidden" id="data_photo" name="fen_image" lay-verify="headCrop">
                    <div id="fileList" class="uploader-list" style="float:right"></div>
                    <div  style="float:left" class="layui-btn" onclick="wk.layer_show1('上传头像',$('#headCrop'),700,570);">选择头像</div>
                    <img id="img_data" class="img-circle" height="80px" width="80px" style="float:left;margin-left: 50px;margin-top: -10px;cursor:pointer;" src="/static/admin/images/head_default.gif" />
                </div>
            </div>
            <div class="layui-form-item layui-col-md-offset1 layui-col-md8">
                <label class="layui-form-label">密码：</label>
                <div class="layui-input-block">
                    <input type="password" name="fen_password" lay-verify="required|pass" placeholder="登录密码" class="layui-input ">
                </div>
            </div>
            {if $ll < 3}
            <div class="layui-form-item layui-col-md-offset1 layui-col-md8">
                <label class="layui-form-label">几级分销（不可更改，谨慎选择）：</label>
                <div class="layui-input-block">
                    <select name="fen_level" lay-verify="required" lay-search="">
                        {if $ll == 1}
                        <option value="2">二级分销商</option>
                        {/if}
                        <option value="3">三级分销商</option>
                    </select>
                </div>
            </div>
            {/if}
            <div class="layui-form-item layui-col-md-offset1 layui-col-md8">
                <label class="layui-form-label">名字：</label>
                <div class="layui-input-block">
                    <input type="text" name="fen_realname" lay-verify="required|realname" placeholder="真实姓名" class="layui-input ">
                </div>
            </div>
            <div class="layui-form-item layui-col-md-offset1 layui-col-md8">
                <label class="layui-form-label">联系方式：</label>
                <div class="layui-input-block">
                    <input type="text" name="fen_phone" lay-verify="required|phone" placeholder="联系方式" class="layui-input ">
                </div>
            </div>
            <div class="layui-form-item layui-col-md-offset1 layui-col-md8">
                <label class="layui-form-label">地址：</label>
                <div class="layui-input-block">
                    <input type="text" name="fen_address" lay-verify="required" placeholder="联系地址" class="layui-input ">
                </div>
            </div>

            <div class="layui-form-item layui-col-md-offset1 layui-col-md8">
                <div class="layui-input-block">
                    <button class="layui-btn" lay-submit="" lay-filter="component-form-element">保存
                    </button>
                    <button class="layui-btn layui-btn-primary" onclick="history.go(-1)">返回</button>
                </div>
            </div>
        </div>
    </div>
</div>
{include file="public/footer" /}
<script type="text/javascript" src="__JS__/Crop.js"></script>
<script>
    //裁剪后的处理
    $("#sureCut").on("click",function () {
        if ($("#tailoringImg").attr("src") == null ){
            return false;
        }else{
            var cas = $('#tailoringImg').cropper('getCroppedCanvas');//获取被裁剪后的canvas
            var base64url = cas.toDataURL('image/png'); //转换为base64地址形式
            $("#img_data").attr('src',base64url).show();
            $('#data_photo').val(base64url);
            //关闭裁剪框
            layer.closeAll();
        }
    });
</script>
<script>
    layui.use(['form'], function() {
        var form = layui.form;
        form.verify({
            username:function(value,item){
                if(!/^[0-9a-zA-Z]{6,30}$/.test(value)){
                    return '名称必须6到30字符，且不能出现空格';
                }
                var checkResult = "";
                $.ajax({
                    url:"{:url('Fenxiao/checkName')}",
                    type:'post',
                    data:"username="+value,
                    async: false,//必须同步
                    success:function(res){
                        if(res.code == 100){
                            checkResult = "该名称已存在";
                        }
                    }
                })
                return checkResult;
            },
            pass: [/^[\S]{6,30}$/,'密码必须6到30位，且不能出现空格'],
            // headCrop:[/^[\S]$/,'头像不能为空'],
            // headCrop:function(value,item){
            //     if(value == ""){
            //         return '头像不能为空';
            //     }
            // },
            realname:[/^[\S]{2,10}$/,'真实姓名必须2到10字符，且不能出现空格']

        });
        form.on('submit(component-form-element)', function (data) {
            $('.layui-btn').addClass('layui-disabled').attr('disabled','disabled');
            $.ajax({
                url:"{:url('fenxiaoAdd')}",
                type:'post',
                dataType:'json',
                data:data.field,
                success:function(res){
                    if (res.code == 200) {
                        wk.success(res.msg,"{:url('Fenxiao/index')}")
                    } else {
                        wk.error(res.msg,'','$(".layui-btn").removeClass(\'layui-disabled\').removeAttr(\'disabled\');');
                    }
                }
            })
        });
    });
</script>
</body>
</html>